<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link rel="shortcut icon" href="../favicon.ico">
    <title>线下抽奖程序</title>

    <link rel="stylesheet" type="text/css" href="../../../../assets/css/weui.css">

    <style type="text/css">
        html,
        body {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            /*font-size: 100%;*/
            /*background-color: #D30026;*/
            font-family: Tahoma, 'Microsoft YaHei', 'Hiragino Sans GB', 'WenQuanYi Micro Hei', sans-serif;
            /*font-size: 10px !important;*/
        }
        
        .christmas-poster {
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            display: none;
        }
        
        .poster {
            height: 100%;
            width: 100%;
            border-style: none;
            display: none;
        }
        
        .my-header {
            color: white;
            font-size: larger;
            text-align: center;
        }
        
        .banner {
            width: 90%;
            margin: 0.5rem auto 0.5rem auto;
        }
        
        .list-container {
            text-align: center;
            /*        width: 100%;
        padding-left: 2%;
        padding-right: 2%;*/
        }
        
        .each-row {
            border-radius: 2px;
            background-color: #ededf1;
            border-width: 1px;
            /*width: 90%;*/
            height: 32px;
            margin: 0 2% 6px 2%;
        }
        
        .button-container {}
        
        .page__bd_spacing {
            padding: 0 15px;
            margin: 0 4rem 2rem 4rem;
        }
    </style>
</head>

<body>
    <div style="text-align:center;"><img class="banner" src="../../../../assets/image/lottery/prize/top-banner.png" alt=""></div>

    <div class="list-container">
        <!--         <div class="each-row" id="row1"></div>
        <div class="each-row" id="row2"></div>
        <div class="each-row" id="row3"></div>
        <div class="each-row" id="row4"></div>
        <div class="each-row" id="row5"></div>
        <div class="each-row" id="row6"></div>
        <div class="each-row" id="row7"></div>
        <div class="each-row" id="row8"></div>
        <div class="each-row" id="row9"></div>
        <div class="each-row" id="row10"></div> -->
    </div>




    <div class="weui-footer weui-footer_fixed-bottom" style="color: rgb(251, 187, 131)">
        <div class="page__bd page__bd_spacing">
            <a href="javascript:;" class="weui-btn weui-btn_plain-primary" style="color: #1aad19; font-size: 15px;">开 始</a>
        </div>

        <p class="weui-footer__text">Copyright © 1998-2016. All Rights Reserved.</p>
        <p class="weui-footer__text">松下电器（中国）有限公司 版权所有</p>
    </div>

    <div id="loadingToast" style="display: none;">
        <div class="weui-mask_transparent"></div>
        <div class="weui-toast">
            <i class="weui-loading weui-icon_toast"></i>
            <p class="weui-toast__content">数据加载中</p>
        </div>
    </div>


    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.js"></script>
    <script type="text/javascript">
        var $loadingToast = $('#loadingToast');

        var doNothing = function() {
            var data = {
                type: "GET",
                url: 'http://www.panasolan.com/pana-BE-RESTful/goto/japan/namelist/10',
                dataType: 'json',
                timeout: 300000,
                success: function(data) {

                    $loadingToast.fadeOut(100);

                    console.log(data);

                    var container = $(".list-container");
                    container.empty();
                    var order = 0;
                    for (each in data) {
                        order++;
                        container.append("<div class='each-row'>[" + (order) + "]" + data[each] + "</div>");
                    }

                }

            };

            $.ajax(data);
        };

        $(".weui-btn").click(function() {
            $loadingToast.fadeIn(100);
            setTimeout(doNothing, 600);
        });
    </script>
</body>

</html>